<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/animate.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<body>
		<div class="web">
			
			<!--音乐播放-->
			<div class="index-bgm">
				<div class="index-bgm-pic">
					<img src="img/index-bgm2.png"/>
				</div>
				<p>TURN OFF</p>
			</div>
			
			<div class="swiper-container">
				<div class="swiper-wrapper">
					
					<div class="swiper-slide page1 page">
						<ul>
							<!--左上角标题-->
							<li id="title">
								<p>赛诺太空之旅</p>
								<p>SPACE TRAVEL</p>
							</li>
							<!--标题下的陨石1-->
							<li id="yunshi1" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="3s">
								<img src="img/index-page1-yunshi1.png"/>
							</li>
							<!--圆球-->
							<li id="yuanqiu" class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="3s">
								<img src="img/index-page1-yuan.png"/>
							</li>
							<!--陨石2-->
							<li id="yunshi2" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="3s">
								<img src="img/index-page1-yunshi2.png"/>
							</li>
							<!--陨石3-->
							<li id="yunshi3" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="3s">
								<img src="img/index-page1-yunshi3.png"/>
							</li>
							<!--石头-->
							<li id="shitou" class="ani" swiper-animate-effect="slideInUp" swiper-animate-duration="5s">
								<img src="img/index-page1-shitou.png"/>
							</li>
							<!--大标题背景-->
							<li id="bigtitlebg" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="1.5s">
								<img src="img/index-page1-titlebg.png"/>
							</li>
							<!--飞机-->
							<li id="feji" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="4s">
								<img src="img/index-page1-feiji.png"/>
							</li>
							<!--太空椅-->
							<li id="taikongyi" class="ani" swiper-animate-effect="zoomInDown" swiper-animate-duration="4s">
								<img src="img/index-page1-taikongyi.png"/>
							</li>
							<!--大标题文字1-->
							<li id="bigtitletext1" class="ani" swiper-animate-effect="flipInX" swiper-animate-duration="1.5s">
								<img src="img/index-page1-bigtitletext1.png"/>
							</li>
							<!--大标题文字2-->
							<li id="bigtitletext2" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="1.5s">
								<img src="img/index-page1-bigtitletext20.png"/>
							</li>
							<!--大标题文字3-->
							<li id="bigtitletext3" class="ani" swiper-animate-effect="slideInDown" swiper-animate-duration="1.5s">
								<img src="img/index-page1-bigtitletext30.png"/>
							</li>
							<!--箭头-->
							<li class="next ani" swiper-animate-effect="slideInUp1" swiper-animate-duration="1s" swiper-animate-delay="4s">
								<img src="img/index-next1.png"/>
							</li>
							<!--最底下字-->
							<li class="nexttext ani" swiper-animate-effect="slideInUp1" swiper-animate-duration="1s" swiper-animate-delay="4.5s">
								<p>向上滑动页面，</br>看看你的太空任务是什么吧！</p>
							</li>
						</ul>
					</div>
					
					<div class="swiper-slide page2 page">
						<ul>
							<!--背景圆-->
							<li id="yuanqiu2" class="ani" swiper-animate-effect="slideInLeft1" swiper-animate-duration="8s">
								<img src="img/index-page2-yuan.png"/>
							</li>
							<!--飞机2-->
							<li id="feji2" class="ani" swiper-animate-effect="slideInLeft2" swiper-animate-duration="4s">
								<img src="img/index-page1-feiji.png"/>
							</li>
							<!--陨石4-->
							<li id="yunshi4" class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="3s">
								<img src="img/index-page2-yunshi4.png"/>
							</li>
							<!--陨石5-->
							<li id="yunshi5" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="4s">
								<img src="img/index-page2-yunshi5.png"/>
							</li>
							<!--page2文字-->
							<li class="text2">
								<p>
									2015年12月11日，<br />
									太空棉家居领导品牌SINOMAX赛诺<br />
									与致力于太空旅游的XCOR环宇太空<br />
									完成签约仪式，正式宣告达成战略合作，<br />
									启动全球新品牌战略。<br /><br />
									从此人类的探索不止于上太空，<br />
									爱让梦想超越引力。
								</p>
							</li>
							<!--箭头-->
							<li class="next ani" swiper-animate-effect="slideInUp1" swiper-animate-duration="1s" swiper-animate-delay="4s">
								<img src="img/index-next1.png"/>
							</li>
							<!--最底下字-->
							<li class="nexttext ani" swiper-animate-effect="slideInUp1" swiper-animate-duration="1s" swiper-animate-delay="4.5s">
								<p>向上滑动页面，</br>看看你的太空任务是什么吧！</p>
							</li>
						</ul>
					</div>
					
					<div class="swiper-slide page3 page">
						<ul>
							<!--背景圆-->
							<li id="yuanqiu3" class="ani" swiper-animate-effect="fangxiao" swiper-animate-duration="20s">
								<img src="img/index-page3-yuan.png"/>
							</li>
							<!--陨石6-->
							<li id="yunshi6" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="4s">
								<img src="img/index-page3-yunshi6.png"/>
							</li>
							<!--陨石7-->
							<li id="yunshi7" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="4s">
								<img src="img/index-page3-yunshi7.png"/>
							</li>
							<!--page3文字-->
							<li class="text3">
								<p>
									2026年12月，xcor太空飞船<br />
									进行了多次穿越探索，<br />
									由于长时间的宇宙飞行，<br />
									宇航员们承受地球4倍的重力<br />
									而导致身体极其疲惫，<br />
									急需收集新科技抗压物资。<br /><br />
									在最后的三段穿越中，<br />
									他们要顺利避过陨石阵到达空间站并成功集齐<br />
									各种抗压物资，你能帮助他们吗？
								</p>
							</li>
							<!--开始游戏-->
							<li id="start" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="2s" swiper-animate-delay="4s">
								<div class="page3-you">
									<img src="img/index-page3-you.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-you.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-zuo.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-zuo.png"/>
								</div>
								<img src="img/index-page3-start.png"/>
							</li>
							<!--规则-->
							<li id="guize" class="ani" swiper-animate-effect="slideInRight" swiper-animate-duration="2s" swiper-animate-delay="4s">
								<div class="page3-you">
									<img src="img/index-page3-you.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-you.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-zuo.png"/>
								</div>
								<div class="page3-you">
									<img src="img/index-page3-zuo.png"/>
								</div>
								<img src="img/index-page3-guize.png"/>
							</li>
						</ul>
					</div>
					
				</div>
			</div>
			
			<div class="guize">
				<div id="guanbi">
					<img src="img/guize/guize-guanbi.png"/>
				</div>
				<div class="guize-box">
					
					<h3 class="guize-title">
						<img src="img/guize/guize-shugang.png"/>
						<p class="redC h3">游戏规则</p>
					</h3>
					
					<p class="blueC guize-text1">玩游戏，赢大奖，跟随sinomax让梦想超越引力！</p>
					
					<div class="dashs">
						<p class="guize-text2 redC">活动时间：2016年3月10日至2016年4月30日</p>
					</div>
					
					<p class="blueC guize-text1">想轻松赢大奖，必先翻攻略！</p>
					
					<div class="liucheng">
						<ul>
							<li>
								<div class="liucheng-yuan">
									<p>
										<span class="redC">1、</span>
										<span class="blueC">关注<br />sinomax</span>
									</p>
								</div>
							</li>
							<li>
								<div class="liucheng-yuan">
									<p>
										<span class="redC">2、</span><span class="blueC">完成<br />游戏任务</span>
									</p>
								</div>
							</li>
							<li>
								<div class="liucheng-yuan">
									<p>
										<span class="redC">3、</span><span class="blueC">分享<br />参与抽奖</span>
									</p>
								</div>
							</li>
						</ul>
					</div>
					
					<div class="dashs">
						<h4>
							<p class="redC h4">TIPS：</p>
							<p class="blueC">动起你的大拇指，刺激又好玩！操作简单！</p>
						</h4>
						<h4>
							<p class="redC h4">RP不够怎么办？</p>
							<p class="blueC">若没抽中奖，分享活动信息，马上摆脱地心引力<br />多一次抽奖机会</p>
						</h4>
					</div>
					
					<h3 class="guize-title">
						<img src="img/guize/guize-shugang.png"/>
						<p class="redC h3">奖品介绍</p>
					</h3>
					
					<div class="guize-jiang">
						<div class="guize-jiang1">
							<div class="guize-jiang1-pic">
								<img src="img/guize/guize-pao1.png"/>
							</div>
							<div class="guize-jiang1-text">
								<span class="blueC">特等奖<br />共<span class="redC">1</span>名<br />梦六方<br />枕垫</span>
							</div>
						</div>
						<div class="guize-jiang1">
							<div class="guize-jiang1-pic">
								<img src="img/guize/guize-pao2.png"/>
							</div>
							<div class="guize-jiang1-text">
								<span class="blueC">一等奖<br />共<span class="redC">1</span>名<br />舒适<br />透气<br />薄垫</span>
							</div>
						</div>
						<div class="clear"></div>
						
						<div class="guize-jiang2">
							<div class="guize-jiang2-pic">
								<img src="img/guize/guize-pao3.png"/>
							</div>
							<div class="guize-jiang2-text">
								<span class="blueC">二等奖 共<span class="redC">3</span>名<br />太空船模型</span>
							</div>
						</div>
						<div class="guize-jiang2">
							<div class="guize-jiang2-pic">
								<img src="img/guize/guize-pao4.png"/>
							</div>
							<div class="guize-jiang2-text">
								<span class="blueC">三等奖 共<span class="redC">4</span>名<br />珍珠太空枕</span>
							</div>
						</div>
						<div class="guize-jiang2 guize-jiang23">
							<div class="guize-jiang2-pic">
								<img src="img/guize/guize-pao5.png"/>
							</div>
							<div class="guize-jiang2-text">
								<span class="blueC">四等奖 共<span class="redC">5</span>名<br />悠悠午睡枕</span>
							</div>
						</div>
						<div class="clear"></div>
						
						<div class="guize-jiang2 guize-jiang23">
							<div class="guize-jiang2-pic">
								<img src="img/guize/guize-pao6.png"/>
							</div>
							<div class="guize-jiang2-text">
								<span class="blueC">五等奖 共<span class="redC">8</span>名<br />泰迪熊公仔</span>
							</div>
						</div>
						<div class="guize-jiang3">
							<div class="guize-jiang3-pic">
								<img src="img/guize/guize-pao7.png"/>
							</div>
							<div class="guize-jiang3-text">
								<span class="blueC">六/七等奖<br />天猫官方旗舰店30/50元优惠券</span>
							</div>
						</div>
						
						<div class="clear"></div>
					</div>
					
					<div class="dashs dashs2">
						<h4>
							<p class="redC h4">活动注意事项：</p>
							<p class="blueC">· 图示奖品仅供参考，奖品以实物为准。</p>
							<p class="blueC">· 获奖用户已经确认领取奖品，不得自行修改，撤销或转让，如遇意外，无法提供制定奖品，活动主办方有权以价值相仿的奖品替代，所有奖品不得兑换现金或销售。</p>
							<p class="blueC">· 如因获奖用户个人原因（无法在规定时间内提供兑奖联系方式等各种原因）不能领取奖项，视为自行弃权，活动主办方将不做任何形式赔偿。</p>
						</h4>
					</div>
					
				</div>
			</div>
			
			<script src="js/mzp-packed.js" type="text/javascript" charset="utf-8"></script>
			<script src="js/js.js" type="text/javascript" charset="utf-8"></script>
			<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
			<script src="js/swiper-3.4.2.min.js" type="text/javascript" charset="utf-8"></script>
			<script src="js/swiper.animate1.0.2.min.js" type="text/javascript" charset="utf-8"></script>
			
			<script type="text/javascript">
				var mySwiper = new Swiper('.swiper-container',{
					direction: "vertical",
					onInit: function(swiper){ //Swiper2.x的初始化是onFirstInit
						swiperAnimateCache(swiper); //隐藏动画元素 
						swiperAnimate(swiper); //初始化完成开始动画
					}, 
					onSlideChangeEnd: function(swiper){ 
						swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
					} 
				})
				document.getElementsByClassName("guize")[0].addEventListener("touchstart",function(e){
//					e.preventDefault();
					e.stopPropagation();
				})
			</script>
			
			
		</div>
		
		
	</body>
</html>
